import { useMemberStore } from "@/popup/stores/member";
import { Button, Empty, message, Spin } from "antd";
import { MemberService } from "@/popup/services/member";
import { useUserStore } from "@/popup/stores/user";
import { useEffect, useState } from "react";
import { MemberList } from "./MemberList";

export const Member = () => {
  const { memberInfo, saveInfo, init: initMemberInfo } = useMemberStore();
  const { userInfo } = useUserStore();
  const [loading, setLoading] = useState(false);
  useEffect(() => {
    initMemberInfo();
  }, []);
  const handleRefreshMember = async () => {
    try {
      setLoading(true);
      const list = await MemberService.getMemberListInfo(userInfo?.token || "");
      saveInfo(list || []);
      console.log(list);
    } catch (error) {
      message.error("刷新失败");
      console.error(error);
    } finally {
      setLoading(false);
    }
  };
  return memberInfo?.length > 0 ? (
    <MemberList refresh={handleRefreshMember} />
  ) : (
    <Spin spinning={loading}>
      <Empty
        description={
          <div>
            暂无数据，请
            <Button
              style={{ padding: 0 }}
              onClick={handleRefreshMember}
              type="link"
            >
              点击
            </Button>
            刷新
          </div>
        }
        image={Empty.PRESENTED_IMAGE_SIMPLE}
      />
    </Spin>
  );
};
